<template>
  <view class="page-select-store">
    <view class="top flex-row" @click="back">
      <image style="width: 50px"
        src="https://hongwu-1318589231.cos.ap-guangzhou.myqcloud.com/dongyuan/default/2025/08/05/b1512bbbc98342388fb686f263bdd94em82gjSTfxLkP21fdfc1fedbf50e16363e3e8b6d92eef.png"
        mode="widthFix" />
      <text style="color: #2378bf; font-size: 16px; margin-left: 6px">登录</text>
    </view>
    <view class="title">登录门店选择</view>
    <view>
      <u-search class="search" placeholder="请输入门店ID/门店名称" v-model="search" :show-action="false"></u-search>
    </view>
    <view class="store-list">
      <view class="store-item" v-for="(item, index) in filteredStoreList" @click="selectStore(item)" :key="index">
        <image src="/static/imgs/close2.png" mode="" class="closeImg" v-if="item.status=='1'"></image>
        <view style="text-align: center">
          <image style="width: 10vw"
            src="https://hongwu-1318589231.cos.ap-guangzhou.myqcloud.com/dongyuan/default/2025/08/05/facec9c4d0104e988ea942d07d4bc0a51GEY2ibdpjBJ983a80c54f65914340cc49f4c8a7202d.png"
            mode="widthFix" />
        </view>
        <view>
          <view style="margin-bottom: 5px; margin-top: 5px">
            <text>门店名称：{{ item.deptName }}</text>
          </view>
          <view>
            <text>门店ID：MC{{ item.deptId }}</text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
  import { ref, reactive, computed, watch, onMounted, onUnmounted } from 'vue'
  import { useUser } from '@/stores/modules/user'
  import { storeListApi } from '@/requests/apis/store'

  const { userInfo } = useUser()
  console.log(userInfo, 'userInfo')
  const search = ref('')
  const storeList = ref([])

  const back = () => {
    uni.navigateBack()
  }

  const selectStore = (item) => {
    uni.setStorageSync('storeInfo', item)
    uni.reLaunch({
      url: '/pages/index/index',
    })
  }
  const filteredStoreList = computed(() => {
    if (!search.value) return storeList.value;

    const searchStr = search.value.trim();
    // 移除搜索内容中的 "MC" 前缀（不区分大小写）
    const searchWithoutMC = searchStr.replace(/^mc/i, '');

    return storeList.value.filter(item => {
      const deptIdStr = String(item.deptId);
      const deptName = String(item.deptName || '');

      // 门店ID匹配：用移除MC后的值
      const idMatch = deptIdStr.includes(searchWithoutMC);
      // 门店名称匹配：用原始搜索值
      const nameMatch = deptName.includes(searchStr);

      return idMatch || nameMatch;
    });
  });
  const getStoreList = async () => {
    const res = await storeListApi({ deptId: userInfo.user.deptId })
    const ownDeptId = userInfo.user.deptId
    const ownPId = res.data.find((item) => item.deptId === ownDeptId)?.parentId
    console.log(ownDeptId, ownPId, res.data)
    // 代表当前所属部门是品牌这一级
    if (ownPId === 100) {
      storeList.value = res.data.filter((item) => {
        return item.parentId === ownDeptId
      })
    } else {
      storeList.value = res.data.filter((item) => {
        return item.parentId === ownPId
      })
    }
  }

  getStoreList()
</script>
<style src="./index.scss" lang="scss"></style>
